import React, { useState } from 'react';
import { Button } from 'antd';
import { connect } from 'umi';
import HistoryTabCard from '@/components/HistoryTabCard';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import { StartTaskModal } from '../../components';
import WaitForScore from './components/WaitForScore';
import BeenScored from './components/BeenScored';
import AbandonScore from './components/AbandonScore';
/**
 * 我评分的 功能页面
 */
const MyScore = ({ global }) => {
    // 发起任务弹窗显示与否
    const [startModalVisible, setStartModalVisible] = useState(false);
    const { taskCount } = global;
    const { toScoreTaskNum } = taskCount;
    const tabList = [
        { key: 'tab1', tab: `待评分(${toScoreTaskNum || 0})` },
        { key: 'tab2', tab: '已评分' },
        { key: 'tab3', tab: '放弃评分' }
    ];
    const extraButtons = (
        <Button
            type="primary"
            style={{ margin: '12px 0' }}
            onClick={() => {
                setStartModalVisible(true);
            }}
        >
            发起任务
        </Button>
    );
    return (
        <PageHeaderWrapper>
            <HistoryTabCard bordered={false} tabList={tabList} tabBarExtraContent={extraButtons}>
                <WaitForScore />
                <BeenScored />
                <AbandonScore />
            </HistoryTabCard>
            <StartTaskModal visible={startModalVisible} setVisible={setStartModalVisible} />
        </PageHeaderWrapper>
    );
};

export default connect(({ global }) => ({ global }))(MyScore);
